<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>绑定手机</title>
		[#include "/common/include.ftl"/]
		<link type="text/css" rel="styleSheet" href="${base}/resource/css/member.css">
		<script type="text/javascript" src="${base}/resource/js/member.js"></script>
		<script type="text/javascript">
			var last = 180;
			var flag = false;
			var time;
			function sendSms(obj){
				$this = $(obj);
				if(flag){
					return;
				}
				var mobile = $("#mobile").val();
				if(mobile == ''){
					oDialog.prompt("请输入手机号码");
					return;
				}
				ajax({
					url	: base + "/member/sendBindSms.jhtml",
					data:{
						mobile	: mobile
					},
					showError:true,
					success:function(data){
						flag = true;
						timer = setInterval(function(){
							last--;
							if(last > 0){
								$this.html(last + "秒后可重发");
							}else{
								flag = false;
								$this.html("获取验证码");
								clearInterval(timer);
							}
						},1000);
					}
				});
			}
			
			function beforeSubmit(){
				if($("#mobile").val() == ''){
					oDialog.prompt("请输入手机号码");
					return false;
				}
				if($("#code").val() == ''){
					oDialog.prompt("请输入手机验证码");
					return false;
				}
				return true;
			}
		</script>
	</head>
	<body class="customer">
		[#include "/common/header.ftl"/]
		<div class="crumbs">
			<a href="${base}/member/index.jhtml">会员中心</a>
			<i style='font-family: simsun;font-style: normal;'>></i>
			<a>账户中心</a>
			<i style='font-family: simsun;font-style: normal;'>></i>
			<a href="${base}/member/safe.jhtml">账户安全</a>
			<i style='font-family: simsun;font-style: normal;'>></i>
			<a href="${base}/member/mobile.jhtml">绑定手机</a>
			<i style='font-family: simsun;font-style: normal;'>></i>
			<a>绑定新手机</a>
		</div>
		<div id="member-main">
			[#include "/common/member-left.ftl"/]
			<div class="member-right">
				<div class="right-wrap">
					<h2 class="right-title">绑定手机号码</h2>
					<div id="bind-phone" class="mc">
						<div class="form">
							<form id="bind-new-phone" action="${base}/member/modifyMobile.jhtml" method="post" onsubmit="return beforeSubmit();">
								<div class="item">
									<div class="label">
										手机号码：
									</div>
									<div class="fl">
										<input type="text" name="mobile" id="mobile" class="text phone">
										<a class="hp-button captcha-btn" onclick="sendSms(this);">获取验证码</a>
										<div class="clear"></div><span class="error-msg phone-error-msg"></span>
									</div>
									<div class="clear"></div>
								</div>
								<div class="item">
									<div class="label">
										请填写手机验证码：
									</div>
									<div class="fl">
										<input type="text" name="code" id="code" class="text captcha">
										<div class="clear"></div><span class="error-msg captcha-error-msg">${error!}</span>
									</div>
								</div>
								<div class="item">
									<div class="label">
										&nbsp;
									</div>
									<div class="fl">
										<button type="submit" class="hp-button submit">
											提交
										</button>
									</div>
								</div>
							</form>
						</div>
					</div>
				</div>
			</div>
			<div class="clear"></div>
		</div>
		[#include "common/footer-slidebar-lazyload.ftl"]
	</body>
</html>